<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta http-equiv="content-type" content="text/html;charset=utf-8">
    <meta name="viewport"
        content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="screen-orientation" content="portrait" />
    <meta name="format-detection" content="telephone=no">
    <meta name="full-screen" content="yes">
    <meta name="x5-fullscreen" content="true">
    <title>App下载</title>
    <link href="assets/css/main.css" rel="stylesheet">
    <link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
</head>

<body>
    <main>
        <div class="guide-container" style="display:none;">
            <div class="guide">
                <div class="text">
                    <div>点击右上角</div>
                    <div>选择在<span style="color:#FFBB37">默认浏览器</span>中打开</div>
                </div>
                <img src="assets/images/icon_browser.png" class="browser" />
                <img src="assets/images/jiantou.png" class="jiantou" />
            </div>
            <button class="iknow-btn">
                知道啦
            </button>
        </div>
        <div class="container">
            <img src="assets/images/logo.png" class="logo">
            <div class="btn-container">
                <button id="download">
                    立即下载
                </button>
            </div>
        </div>
    </main>
    <script>
        const ua = navigator.userAgent || '';
        const isWechat = /micromessenger\/([\d.]+)/i.test(ua);
        var $ = function (ele) {
            return document.querySelector(ele);
        }
        window.onload = function () {
            $(".iknow-btn").addEventListener('click',function(){
                $(".guide-container").style.display = 'none'
            })

            $("#download").addEventListener('click',function(){
                if(isWechat){
                    $(".guide-container").style.display = 'block'
                }else{
                    window.open("http://baidu.com/app.apk")
                }
            })
        }
    </script>
</body>

</html>